<template>
  <view class="new_achievement">
    <div class="pd_l_30 pd_r_30 bg-fff pd_t_50 pd_b_45">
				<div class="font-28 font-b col-333 pd_b_10">学科成绩记录</div>
				<div class="row cont-center">
				<div class="font-24 col-333 flex-1 pd_r_68">请填写最近一学期学科成绩，以获取您的新高考学业规划方案</div>
					<div class="add-btn col-1f476d font-26 text-cent" @click="genGrade">添加科目</div>
				</div>
			</div>
    <div class="pd_l_30 pd_r_30 bg-fff mg_t_10">
      <view class="item_obj row" v-for="(item, index) in grade" :key="index">
        <view class="left" style="width: 35%; margin-right: 5%">
          <u-form-item label-width="0" right-icon="arrow-right">
            <view @click="itemClick(item, index)">{{item.subject || '请选择'}}</view>
             <u-select v-model="item.bankShow"
                      mode="single-column"
                      label-name="name"
                      value-name="id"
                      :list="kemuList" @confirm="actionSheetCallback1"></u-select>
          </u-form-item>
        </view>
        <view class="right flex-1">
          <u-form-item label-width="0">
            <u-input :clearable="false" type="number" v-model="item.score" placeholder="请输入分数"/>
            <view slot="right" class="row" style="align-items: center" @click="removeItem(index)">
              <u-icon name="close-circle-fill" size="50" color="#1f476d"></u-icon>
            </view>
          </u-form-item>
        </view>
      </view>
    </div>
    <div class="user-btn text-cent col-fff font-30 bg-1f476d" @click="setBaseInfo">保存</div>
    <div class="skip-btn text-cent col-666 font-30" @click="openWindow">跳过</div>
  </view>
</template>

<script>
  import {TOAST} from "../../util/util";
  import {request} from "../../util/api";

  export default {
    onShow() {
      uni.$on('new_login_params', data => {
        this.params = data.params
        setTimeout(() =>{
          this.kemuList = data.params.kemuList
        }, 310)
      })
    },

    onUnload() {
      // 移除监听事件
      uni.$off('new_login_params')
    },

    data() {
      return {
        grade: [{bankShow: false}],
        kemuList: [],
        params: {},
        current_kemu_index: 0
      }
    },
    methods:{
      genGrade() {
       this.grade.push({
          bankShow: false,
       })
      },

      itemClick(item, index) {
        this.current_kemu_index = index
        this.$set(this.grade[index], 'bankShow', true)
      },

      removeItem(index) {
	    	if (this.grade.length > 1) {
	    		this.grade.splice(index, 1)
        } else {
	    		TOAST('至少一个')
        }
      },

      setBaseInfo() {
        var grade = JSON.parse(JSON.stringify(this.grade))
        let ret = true
        grade.forEach(item => {
        	if (!item.subject || !item.score) {
        		ret = false
          }
        })
        if (!ret) {
        	TOAST('请完善科目和成绩信息');
          return false;
        }
        var _grade = []
	  		grade.forEach(item => {
          _grade.push(item.subject + ':' + item.score)
        })
        request({
          url: '/app/userCenter/saveSchoolGrade',
          method: 'post',
          data: {
            "schoolName": this.params.schoolName,
            "className": this.params.className,
            "classId": this.params.classId,
            "grade": _grade.join(',')
          }
        }).then(ret => {
          this.$u.route({
            url: '/pages/index/index',
            type: 'switchTab'
          })
        })
      },

      actionSheetCallback1(res) {
	    	this.$set(this.grade[this.current_kemu_index], 'subject', res[0].label)
      },

      openWindow() {
        this.$u.route({
          url: '/pages/index/index',
          type: 'switchTab'
        })
      }
    }
  }
</script>

<style lang="scss">
.new_achievement {
  min-height: 100%;
  background: #f7f7f7;
  .pd_r_68 {
    padding-right: 68upx;
  }
  .bg-1f476d {
    background: #1f476d;
  }
  .add-btn{
    width: 148upx;
    height: 54upx;
    line-height: 54upx;
    border: 1px solid #1f476d;
    border-radius: 27upx;
  }
  .user-btn {
    width: 90%;
    height: 88upx;
    border-radius: 44upx;
    line-height: 88upx;
    margin: 260upx auto 50upx;
  }
  .skip-btn {
    width: 90%;
    height: 88upx;
    border-radius: 44upx;
    line-height: 88upx;
    border: 1px solid #CCCCCC;
    margin: 0 auto;
  }
}
</style>
